html,body{
    width: 100%;
    height: 100%;
    #redMain{
        position: relative;
        width: 100%;
        height: 100%;
        background: #fff;
        overflow: auto;
        .topBg{
            position: absolute;
            width: 100%;
            height: 17.04rem;
            background: url("../../images2/topBg3.png") no-repeat;
            background-size: 100% 100%;
        }
        .detailBox{
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 10.22rem;
            height: 72%;
            background:#fff;
            box-shadow:0px 14px 29px 0px rgba(231,231,231,1);
            overflow: hidden;
            border-radius: 0.2rem 0.2rem 0 0;
            z-index: 2;
            .topBtn{
                position: relative;
               // left: 50%;
               // transform: translateX(-50%);
               // top: -1rem;
               width: 100%;
               height: 1.44rem;
               display: flex;
               .btn{
                   font-size: 0.43rem;
                   text-align: center;
                   color: #333;
                   background: #D5E8FF;
                   width: 50%;
                   height: 1.44rem;
                   line-height: 1.44rem;
               }
               .leftBtn{
                   background-size: 100% 100%;
   
            
               }
               .on{
                   background: #fff;
                   font-size: 0.5rem !important;
                   font-weight: bold;
               }

               .rightBtn{
               
                   font-size: 0.43rem;
                   bottom: 0;
                   font-size: 0.43rem;
               }
           }
            .detailBlock{
                position: relative;
                width: 100%;
                height: 100%;
                overflow: auto;
                padding: 0.58rem 0.36rem 1.5rem;
                box-sizing: border-box;
                z-index: 2;
                .item{
                    position: relative;
                    width: 9.5rem;
                    height: 3.46rem;
                    background:rgba(255,255,255,1);
                    box-shadow:0px 14px 29px 0px rgba(231,231,231,1);
                    border-radius: 0.3rem;
                    box-sizing: border-box;
                    padding: 0.46rem ;
                    display:flex;
                    flex-wrap: wrap;
                    flex-flow: column;
                    justify-content: space-between;
                    margin-bottom: 0.3rem;
                    div{
                        width: 100%;
                        color: #999999;
                        font-size: 0.4rem;
                    }
                    div:nth-of-type(1){
                        color: #333333;
                        font-size: 0.46rem;
                        span{
                            color: #0949FF;
                        }
                    }
                    .redBtn{
                        position: absolute;
                        right: 0.46rem;
                        top: 1.84rem;
                        width: 3.15rem;
                        height: 1.28rem;
                        line-height: 1rem;
                        text-align: center;
                        color: #FFFFFF;
                        font-size: 0.36rem;
                        background: url("../../images2/redBtn.png") no-repeat;
                        background-size: 100% 100%;
                    }
                }
                .item.tips{
                    .tipsIcon{
                        position: absolute;
                        top: -0.03rem;
                        right: -0.03rem;
                        width: 2.3rem;
                        height: 0.58rem;
                        line-height: 0.58rem;
                        background: url("../../images2/icon2.png") no-repeat;
                        background-size: 100% 100%;
                        color: #666666;
                        font-size: 0.3rem;
                        text-align: center;

                    }
                }
            }
            .hide{
                display: none;
            }
        }
    }
}

.animation {
    animation: animToast 0.5s;
}

@keyframes animToast {
    0% {
        transform: skewY(0deg);
    }

    50% {
        transform: skewY(-15deg);
    }

    100% {
        transform: skewY(0deg);
    }
}
.toast {
    position: fixed;
    top: 38%;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    background: rgba(0, 0, 0, 0.6);
    padding: 0.2rem;
    color: #fff;
    border-radius: 0.2rem;
    opacity: 0;
    z-index: -99;
    font-size: 0.5rem;
}

.ani_code {
    animation: animToast2 2s;
}

@keyframes animToast2 {
    from {
        top: 30%;
        opacity: 0;
        z-index: 9999;
    }

    to {
        top: 38%;
        opacity: 1;
        z-index: 9999;
    }
}